<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'SellDetails.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<link type="text/css" rel="stylesheet"
	href="/EasyBuy/statics/css/style.css" />


<script type="text/javascript"
	src="/EasyBuy/statics/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="/EasyBuy/statics/js/menu.js"></script>

<script type="text/javascript" src="/EasyBuy/statics/js/lrscroll_1.js"></script>


<script type="text/javascript" src="/EasyBuy/statics/js/n_nav.js"></script>


</head>
<script type="text/javascript"
		src="/EasyBuy/statics/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		function hideType(){
			$(".leftNav").hide();
		}
		hideType();
		
		
		$(".pingLun").click(function(){
			$(".jud_list").html("");
			$(".jud_list").append("<tr valign='top'><td>"+
			"评价内容:<input class='contents' type='text' /></td></tr><tr valign='top'><td>"+
			"<input type='button' class='fa' value='发表'/></td></tr>");
			
			$(".fa").click(function(){
				var content=$(".contents").val();
				var productId=$(".lim_name").attr("title");
				$.getJSON("CommentServlet","opr=addComment&content="+content+"&productId="+productId,callBack);
				function callBack(data){
					if(data==1){
						alert("发表成功！");
						selectAll();
					}else{
						alert("发表失败！");
						selectAll();
					}
				}
			});
		});
		function selectAll(){
			var productId=$(".lim_name").attr("title");
			$.getJSON("CommentServlet","opr=commentsProductId&productId="+productId,callAll);
			function callAll(datas){
				$(".jud_list").html("");
				if(datas.length==0){
					$(".jud_list").append("<tr valign='top'><td><font color='#999999'>暂无评论！</font></td></tr>");
				}else{
					for ( var i = 0; i < datas.length; i++) {
					$(".jud_list").append("<tr valign='top'>"+
										"<td width='160'><img src='/EasyBuy/statics/images/"+datas[i].comment_url+"'"+
											"width='20' height='20' align='absmiddle' />&nbsp;"+datas[i].comment_author+
										"</td>"+
										"<td width='180'>颜色分类：<font color='#999999'>粉色</font> <br />"+
											"型号：<font color='#999999'>50ml</font>"+
										"</td>"+
										"<td>"+datas[i].comment_content+"。<br /> <font color='#999999'>"+datas[i].comment_date+"</font>"+
										"</td>"+
									"</tr>");
				}
				}
			}
		}
		
		$("#p_details,#p_comment").hide();
		$("#current").click(function(){
			$(this).addClass("current");
			$("#details,#comment").removeClass("current");
			$("#p_attribute").show();
			$("#p_details,#p_comment").hide();
		});
		$("#details").click(function(){
			$(this).addClass("current");
			$("#current,#comment").removeClass("current");
			$("#p_details").show();
			$("#p_attribute,#p_comment").hide();
		});
		$("#comment").click(function(){
			selectAll();
			$(this).addClass("current");
			$("#details,#current").removeClass("current");
			$("#p_comment").show();
			$("#p_details,#p_attribute").hide();
		});
		//热销品牌
		$(".s_hot_brand").html("");
		$.getJSON("SellServlet","opr=sellHotBrand",callBackHotBrand);
		function callBackHotBrand(dataHot){
			for(var i=0;i<dataHot.length;i++){
				$(".s_hot_brand").append("<li><a href='BrandServlet?opr=brandIdLists&id="+dataHot[i].brand_id+"'><img"+
								" src='/EasyBuy/statics/images/"+dataHot[i].brand_url+"' width='160' height='59' />"+
						"</a>"+
						"</li>");
			}
		}
		//倒计时
		var date1=new Date(); //开始时间
		var date2=new Date("2018-10-21 09:09:09"); //结束时间
		var date3=date2.getTime()-date1.getTime(); //时间差的毫秒数
		//计算出相差天数
		var days=Math.floor(date3/(24*3600*1000));
		//计算出小时数
		var leave1=date3%(24*3600*1000); //计算天数后剩余的毫秒数
		var hours=Math.floor(leave1/(3600*1000));
		//计算相差分钟数
		var leave2=leave1%(3600*1000); //计算小时数后剩余的毫秒数
		var minutes=Math.floor(leave2/(60*1000));
		//计算相差秒数
		var leave3=leave2%(60*1000); //计算分钟数后剩余的毫秒数
		var seconds=Math.round(leave3/1000);
		var st=parseInt(days)*24*60*60+parseInt(hours)*60*60+parseInt(minutes)*60+parseInt(seconds);
		var intDiff = parseInt(st); //倒计时总秒数量
		function timer(intDiff) {
 		window.setInterval(function () {
    		var day = 0,
      		hour = 0,
      		minute = 0,
      		second = 0; //时间默认值
    		if (intDiff > 0) {
      			day = Math.floor(intDiff / (60 * 60 * 24));
      			hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
      			minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
      			second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
    		}
    		if (minute <= 9) minute = '0' + minute;
    		if (second <= 9) second = '0' + second;
    		$('.day_show').html(day + '天');
    		$('.hour_show').html('<s id="h"></s>' + hour + '时');
   			$('.minute_show').html('<s></s>' + minute + '分');
    		$('.second_show').html('<s></s>' + second + '秒');
    		intDiff--;
  		}, 1000);
	}
  	timer(intDiff);
	});
</script>
<body>
<c:if test="${list1==null }">
	<%
		request.getRequestDispatcher("/IndexServlet?opr=type&hre=SellDetails").forward(request, response);
	 %>
</c:if>
	<!-- 头部 -->

	<%@ include file="../../common/header.jsp"%>
	<%@ include file="../../common/preHeader.jsp"%>
	<!--Begin Header Begin-->


	<!--End Menu End-->
	<div class="i_bg">
		<div class="postion">
			<span class="fl">全部 > 美妆个护 > 香水 > 迪奥 > 迪奥真我香水</span>
		</div>
		<div class="content mar_10">
			<!--Begin 特卖 Begin-->
			<div class="s_left">
				<div class="lim_time">
					<div class="lim_sh_bg">
						<span class="lim_sh">分享</span> <a href="#"><img
							src="/EasyBuy/statics/images/sh_1.gif" />
						</a> <a href="#"><img src="/EasyBuy/statics/images/sh_2.gif" />
						</a> <a href="#"><img src="/EasyBuy/statics/images/sh_3.gif" />
						</a> <a href="#"><img src="/EasyBuy/statics/images/sh_4.gif" />
						</a> <a href="#"><img src="/EasyBuy/statics/images/sh_5.gif" />
						</a>
					</div>
					<table border="0" style="width:100%; margin-bottom:50px;"
						cellspacing="0" cellpadding="0">
						<tr valign="top">
							<td width="315">
								<div class="lim_name" title="${productInfo.id }">${productInfo.name }</div>
								<div class="lim_price">
									<span class="ch_txt">￥${productInfo.xianPrice }</span> <a href="#" class="ch_a">抢购</a>
								</div>
								<div class="lim_c">
									<table border="0" style="width:100%; color:#888888;"
										cellspacing="0" cellpadding="0">
										<tr>
											<td width="35%">市场价</td>
											<td width="65%">折扣</td>
										</tr>
										<tr style="font-family:'Microsoft YaHei';">
											<td style="text-decoration:line-through;">${productInfo.price }</td>
											<td>8.0</td>
										</tr>
									</table>
								</div>
								<div class="lim_c">
									<div class="des_choice">
										<span class="fl">型号：</span>
										<ul>
											<li class="checked">30ml
												<div class="ch_img"></div>
											</li>
											<li>50ml
												<div class="ch_img"></div>
											</li>
											<li>100ml
												<div class="ch_img"></div>
											</li>
										</ul>
									</div>
									<div class="des_choice">
										<span class="fl">颜色：</span>
										<ul>
											<li>红色
												<div class="ch_img"></div>
											</li>
											<li class="checked">白色
												<div class="ch_img"></div>
											</li>
											<li>黑色
												<div class="ch_img"></div>
											</li>
										</ul>
									</div>
								</div>
								<div class="lim_c">
									<span class="fl">数量：</span><input type="text" value="${productInfo.stock }"
										class="lim_ipt" />
								</div>
								<div class="lim_clock">
									距离团购结束还有<br /> <span class='day_show'></span><span class='hour_show'></span>
									<span class='minute_show'></span><span class='second_show'></span>
								</div></td>
							<td width="525" align="center"
								style="border-left:1px solid #eaeaea;"><img
								src="/EasyBuy/statics/images/${productInfo.fileName}" width="460"
								height="460" />
							</td>
						</tr>
					</table>
				</div>
				<div class="des_border">
					<div class="des_tit">
						<ul>
							<li class="current" id="current"><a>商品属性</a>
							</li>
							<li id="details"><a>商品详情</a>
							</li>
							<li id="comment"><a>商品评论</a>
							</li>
						</ul>
					</div>
					<div class="des_border" id="p_attribute" style="margin-top: 10">
						<div class="des_t">商品属性</div>
						<div class="des_con">

						<table border="0" align="center"
							style="width:100%; font-family:'宋体'; margin:10px auto;"
							cellspacing="0" cellpadding="0">
							<tr>
								<td>商品名称：${productInfo.name }</td>
								<td id="productId">商品编号：${productInfo.id }</td>
								<td>品牌： ${productInfo.brand_name }</td>
								<td>上架时间：${details.date }</td>
							</tr>
							<tr>
								<td>商品毛重：160.00g</td>
								<td>商品产地：${details.place }</td>
								<td>香调：果香调香型：淡香水/香露EDT</td>
								<td>&nbsp;</td>
							</tr>
							<tr>
								<td>容量：1ml-15ml</td>
								<td>类型：女士香水，Q版香水，组合套装</td>
								<td>&nbsp;</td>
								<td>&nbsp;</td>
							</tr>
						</table>


					</div>
					</div>
					
				</div>

				<div class="des_border" id="p_details">
					<div class="des_t">商品详情</div>
					<div class="des_con">
						<table border="0" align="center"
							style="width:745px; font-size:14px; font-family:'宋体';"
							cellspacing="0" cellpadding="0">
							<tr>
								<td width="265"><img src="/EasyBuy/statics/images/${productInfo.fileName}"
									width="206" height="412" />
								</td>
								<td><b>${productInfo.name }</b><br /> 【商品规格】：${details.specifications }<br /> 【商品质地】：${details.texture }<br />
									【商品日期】：${details.date }<br /> 【商品产地】：${details.place }<br /> 【商品包装】：${details.packing }<br />
									 【适用人群】：${details.people }<br /></td>
							</tr>
						</table>

						<p align="center">
							<img src="/EasyBuy/statics/images/${details.imgdetail }" width="746"
								height="1700" /><br />
						</p>

					</div>
				</div>

				<div class="des_border" id="p_comment">
					<div class="des_t">商品评论</div>

					<table border="0" class="jud_tab" cellspacing="0" cellpadding="0">
						<tr>
							<td width="175" class="jud_per">
								<p>80.0%</p>好评度</td>
							<td width="310">
								<table border="0" style="width:100%;" cellspacing="0"
									cellpadding="0">
									<tr>
										<td width="90">好评<font color="#999999">（80%）</font>
										</td>
										<td><img src="/EasyBuy/statics/images/pl.gif"
											align="absmiddle" />
										</td>
									</tr>
									<tr>
										<td>中评<font color="#999999">（20%）</font>
										</td>
										<td><img src="/EasyBuy/statics/images/pl.gif"
											align="absmiddle" />
										</td>
									</tr>
									<tr>
										<td>差评<font color="#999999">（0%）</font>
										</td>
										<td><img src="/EasyBuy/statics/images/pl.gif"
											align="absmiddle" />
										</td>
									</tr>
								</table></td>
							<td width="290" class="jud_bg">您可对已购买商品进行评价<br />
							<a class="pingLun"><img src="/EasyBuy/statics/images/btn_jud.gif" />
							</a>
							</td>
						</tr>
					</table>
					<table border="0" class="jud_list"
						style="width:100%; margin-top:30px;" cellspacing="0"
						cellpadding="0">
						<c:choose>
							<c:when test="${comments=='[]' }">
								<tr valign="top"><td><font color="#999999">暂无评论！</font></td></tr>
							</c:when>
							<c:otherwise>
								<c:forEach items="${comments }" var="comment">
									<tr valign="top">
										<td width="160"><img src="/EasyBuy/statics/images/${comment.comment_url }"
											width="20" height="20" align="absmiddle" />&nbsp;${comment.comment_author}
										</td>
										<td width="180">颜色分类：<font color="#999999">粉色</font> <br />
											型号：<font color="#999999">50ml</font>
										</td>
										<td>${comment.comment_content }。<br /> <font color="#999999">${comment.comment_date }</font>
										</td>
									</tr>
								</c:forEach>
							</c:otherwise>
						</c:choose>
					</table>
					<div class="pages">
						<a class="p_pre">上一页</a><a class="cur">1</a><a
							class="p_pre">下一页</a>
					</div>

				</div>

			</div>
			<!--End 特卖 End-->

			<div class="s_right">
				<div class="r_history">
					<!-- 引用浏览历史页面  -->
					<%@ include file="../../common/CategorySide.jsp"%>
				</div>
				<div class="sell_hot">
					<div class="s_hot_t">
						<span class="fl">热销品牌</span> <span class="h_more fr"><a
							href="/EasyBuy/pre/product/Brand.jsp">更多</a>
						</span>
					</div>
					<ul class="s_hot_brand">
						
					</ul>
				</div>
			</div>
		</div>
		<!--End 猜你喜欢 End-->

		<%@ include file="../../common/footer.jsp"%>

		<!-- 脚部 -->
	</div>
</body>
</html>
